<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2016/10/6
  Time: 14:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>


<body>
            <div class="row">
                <div class="col-sm-9">
                    <div class="article-content">
                        <div class="ac-hd">
                            <h1>${caseDetail.matName}</h1>
                            <h5>事项编号：${caseDetail.matNum}</h5>

                            <div class="ac-hd-btn">

                            </div>
                            <div class="ac-remind">
                                <ul>
                                    <li>
                                        <i class="acr-i01"></i>

                                        <p>法定时限：<span>${caseDetail.legalPromiseDays}个工作日</span></p>

                                        <p>承诺时限：<span>${caseDetail.promiseDays}个工作日</span></p>
                                    </li>
                                    <li>
                                        <i class="acr-i02"></i>

                                        <p>事项性质：<span class="acr-nature">
                                            <c:choose>
                                                <c:when test="${caseDetail.matProp==1}">许可</c:when>
                                                <c:when test="${caseDetail.matProp==2}">确认</c:when>
                                                <c:when test="${caseDetail.matProp==3}">服务</c:when>
                                                <c:otherwise>其他</c:otherwise>
                                            </c:choose>
                                        </span></p>
                                    </li>
                                    <li>
                                        <i class="acr-i03"></i>

                                        <p>受理机构：<a href="#">办理部门地址、联系电话</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="ac-bd sxsb">
                            <div class="sxsb_tip yellow">
                                <b>温馨提示：</b>请选择您要办理的部门，部门后面有“（可选）”表示此部门可以受理此事项。
                            </div>

                            <div class="sxsb_step">
                                <b>1</b>选择受理公安机关
                            </div>

                            <div class="form_main">
                                <table width="100%">
                                    <tr>
                                        <td width="20%" class="textright"><span class="text-red">*</span>选择公安机关</td>
                                        <td width="20%">
                                            <select id="firstDept" onchange="javascript:loadSecondDept('${caseDetail.matNum}');">
                                                <option value="">--请选择--</option>
                                                <c:forEach items="${firstDepts}" var="firstDept">
                                                    <option value="${firstDept.deptId}" data-canApply="${firstDept.canApply}" >${firstDept.deptName} <c:if test="${firstDept.canApply eq 1}">(可选)</c:if> </option>
                                                </c:forEach>
                                            </select>
                                        </td>
                                        <td width="20%">
                                            <select id="secondDept" onchange="javascript:loadThirdDept('${caseDetail.matNum}');" style="display: none">
                                            </select>
                                        </td>
                                        <td width="20%">
                                            <select id="thirdDept" style="display: none">
                                            </select>
                                        </td>
                                    </tr>

                                </table>
                            </div>

                            <div class="sxsb_step">
                                <b>2</b>申请人信息
                            </div>

                            <div class="form_main">
                                <table width="100%">
                                    <tr>
                                        <td width="20%" class="textright">申请人</td>
                                        <td width="30%"><input type="text" value="${applyUser.realName}" name="" readonly
                                                               class="readonly"></td>
                                        <td width="20%" class="textright">公民身份号码</td>
                                        <td width="30%"><input type="text" value="${applyUser.idNum}" name="" readonly
                                                                class="readonly"></td>
                                    </tr>
                                    <tr>
                                        <td class="textright">联系地址</td>
                                        <td><input type="text" name="linkAddress" id="linkAddress"  class="readonly" readonly value="${applyUser.address}"></td>
                                        <td class="textright">电话号码</td>
                                        <td><input type="text" value="${applyUser.telephone}" name="linkPhone" readonly id="linkPhone"
                                                   class="readonly"></td>
                                    </tr>
                                </table>
                            </div>

                            <div class="sxsb_step">
                                <b>3</b>附件材料上传<span>( 注：只能上传大于10KB小于500KB的jpg\png图片或doc\docx文档或xls/xlsx表格 )</span>
                            </div>
                            <ul class="sxsb_ul">
                                <c:forEach var="manifest" varStatus="manifestIndex" items="${caseDetail.manifests}">
                                    <li>
                                        <p class="line attRequred${manifest.requred}">${manifestIndex.index+1}、<c:if test="${manifest.requred == 'Y'}"><span class="text-red">*</span></c:if>${manifest.itemName}：
                                            <a href="javascript:void(0);" class="avater_a">
                                                <i></i>上传附件
                                                <input id="${manifest.guid}" onclick="javascript:applyfileupload('${manifest.guid}');" name="materialFile" type="file" value="" class="in-file">
                                            </a>
                                        </p>
                                        <div class="attach" style="display: none;">
                                            <img style="width: auto"/>
                                            <span></span>
                                            <a href="#" class="delete"></a>
                                        </div>
                                    </li>

                                </c:forEach>
                            </ul>

                            <div class="ljsb_main">
                                <a href="javascript:;" class="btn btn-yellow btn-lg"
                                   onClick="javascript:validApplyInfo();">下一步</a>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="panel panel-default panel-side">
                        <div class="panel-heading">
                            <h3 class="panel-title">相关办证</h3>
                        </div>
                        <div class="panel-body">
                            <ul class="nb-list">
                                <c:forEach var="news" items="${newList.list}">
                                    <li><a href="#">${news.title}</a></li>
                                </c:forEach>
                            </ul>
                        </div>
                    </div>
                    <div class="panel panel-default panel-side">
                        <div class="panel-heading">
                            <h3 class="panel-title">相关政策</h3>
                        </div>
                        <div class="panel-body">
                            <ul class="nb-list">
                                <c:forEach var="notice" items="${noticeList.list}">
                                    <li><a href="#">${notice.title}</a></li>
                                </c:forEach>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>



<!--事项申报-选择办理方式-->
<div class="modal fade transact-way" tabindex="-1" role="dialog" id="chooseWay-dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">选择办理方式</h4>
            </div>
            <div class="modal-body">
                <div class="btn-box">
                    <button class="btn btn-blue btn-lg" id="way01-btn" onClick="$('#way01-dialog').modal();">窗口办理
                    </button>
                    <button class="btn btn-green btn-lg" id="way02-btn" onClick="$('#way02-dialog').modal();">邮递服务
                    </button>
                </div>

            </div>
        </div>
    </div>
</div>
<!--事项申报-邮递服务-->
<div class="modal fade transact-way" tabindex="-1" role="dialog" id="way02-dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">邮递服务</h4>
            </div>
            <div class="modal-body">
                <div class="tw-bd-item">
                    <h3>上门取件 (邮寄人员上门收取申报材料送至办件受理部门)<a href="#">管理我的地址</a></h3>
                    <ul class="tbi-addr">
                        <li class="curr">
                            <label>
                                <input type="radio" name="q-out" value="张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434" checked="checked">
                                张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434
                            </label>
                        </li>
                        <li>
                            <label>
                                <input type="radio" name="q-out" value="张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434">
                                张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434
                            </label>
                        </li>
                        <li class="li-otherAddr">
                            <label>
                                <input type="radio" name="q-out" value="">
                                使用其他地址
                            </label>

                            <div class="tbi-otherAddr">
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>联系人：</label>
                                    <input type="text" class="form-control">
                                </div>
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>联系电话：</label>
                                    <input type="text" class="form-control">
                                </div>
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>取件地址：</label>
                                    <select class="form-control">
                                        <option>省/直辖市</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <select class="form-control">
                                        <option>市</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <select class="form-control">
                                        <option>区/县</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <input type="text" class="form-control" placeholder="请输入详细地址">
                                </div>
                                <div class="btn-box text-left">
                                    <button class="btn btn-blue btn-sm">添加新地址</button>
                                </div>

                            </div>
                        </li>
                    </ul>
                </div>
                <div class="tw-bd-item">
                    <h3>送件上门 (邮寄人员送件上门将颁发的证件或许可资料送至申报人)<a href="#">管理我的地址</a></h3>
                    <ul class="tbi-addr">
                        <li>
                            <label>
                                <input type="radio" name="s-in" value="">
                                张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434
                            </label>
                        </li>
                        <li>
                            <label>
                                <input type="radio" name="s-in" value="">
                                张三&nbsp;&nbsp;河南省洛阳市洛龙区&nbsp;&nbsp;陵园路5号院&nbsp;&nbsp;13913108434
                            </label>
                        </li>
                        <li class="li-otherAddr">
                            <label>
                                <input type="radio" name="s-in" value="">
                                使用其他地址
                            </label>

                            <div class="tbi-otherAddr">
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>联系人：</label>
                                    <input type="text" class="form-control">
                                </div>
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>联系电话：</label>
                                    <input type="text" class="form-control">
                                </div>
                                <div class="otherAddr-group">
                                    <label><span class="red">*</span>取件地址：</label>
                                    <select class="form-control">
                                        <option>省/直辖市</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <select class="form-control">
                                        <option>市</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <select class="form-control">
                                        <option>区/县</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                    </select>
                                    <input type="text" class="form-control" placeholder="请输入详细地址">
                                </div>
                                <div class="btn-box text-left">
                                    <button class="btn btn-blue btn-sm">添加新地址</button>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="tw-bd-item tw-bd-payWay">
                    <h3>支付方式</h3>
                    <label class="radio-inline offline-pay">
                        <input type="radio" name="" value=""> 线下支付
                    </label>
                    <label class="radio-inline online-pay">
                        <input type="radio" name="" value="" checked="checked"> 在线支付
                    </label>
                </div>
                <div class="btn-box">
                    <button class="btn btn-yellow btn-lg" onClick="/*$('#waySuccess-dialog').modal();*/mattersSubmit();">办件完成</button>
                </div>

                </div>

            </div>
        </div>
    </div>
</div>

<!--事项申报-选择窗口办理-->
<div class="modal fade transact-way" tabindex="-1" role="dialog" id="way01-dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">窗口办理</h4>
            </div>
            <div class="modal-body">
                <h4 class="text-success text-center" style="margin: 50px 0;">预审通过后，您可以携带相关办件材料至窗口办理</h4>

                <div class="btn-box">
                    <button class="btn btn-blue btn-lg" onClick="mattersSubmit('${caseDetail.matNum}','${applyUser.acountId}')">确定</button>
                </div>
            </div>
        </div>
    </div>
</div>

<!--事项申报-成功-->
<div class="modal fade transact-way" tabindex="-1" role="dialog" id="waySuccess-dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">事项申报成功</h4>
            </div>
            <div class="modal-body">
                <h4 class="text-success text-center">您在网上申请的办件已经申报完成!</h4>

                <p class="text-center" id="task_id">办件编号：BJ2558412554141</p>

                <p class="text-center">订单编号：BJ2558412554141</p>
            </div>
        </div>
    </div>
</div>

<script src="<c:url value='/resource/js/jquery.ui.widget.js'/>"></script>
<script src="<c:url value='/resource/js/jquery.fileupload.js'/>"></script>
<script src="<c:url value='/resource/js/jquery.iframetransport.js'/>"></script>
<link rel="stylesheet" href="<c:url value='/resource/css/jquery.fileupload.css'/>">
<script>

    var file;
    /*$(".in-file").change(function(){
        file = this.files[0];
        console.log("文件名:"+file.name);
        var attachBox;
        if(file){
            $.ajax({
                url: '<c:url value="/matters/ajax-att"/>',
                type:"POST",
                data : {"matNum" : "${caseDetail.matNum}","deptId":val,"lev":"51"},
                dataType: "json",
                success: function (resp) {
                    if(resp.length>0){

                    }else{
                        $thirdDept.hide();
                    }
                },
                error:function(res){

                }
            })
            attachBox = $('<div class="attach"><span>'+file.name+'</span><a href="javascript:;" class="delete" onclick="deleteFlie(this);"></a></div>')
            attachBox.appendTo($(this).parents("li"));
        }
    });*/


</script>
</body>




